<template>
<div class="nav">
<div class="line">


  <el-menu
    :default-active="activeIndex2"
    class="el-menu-demo"
    mode="horizontal"
    @select="handleSelect"
    background-color="#545c64"
    text-color="#fff"
    active-text-color="#ffd04b"
  >

  <el-menu-item index="/" style="margin-left: 100px"><i class="el-icon-s-cooperation"></i>接收订单</el-menu-item>
  <el-menu-item index="/system-notice"><i class="el-icon-s-order"></i>系统公告</el-menu-item>
  <el-menu-item index="/order-release"><i class="el-icon-thumb"></i>发布订单</el-menu-item>
  <el-menu-item index="/myOrder"><i class="el-icon-notebook-1"></i>我的订单</el-menu-item>
  <el-menu-item index="/leave-word"><i class="el-icon-chat-line-round"></i>在线留言</el-menu-item>
  <el-menu-item index="/personal-center/page"><i class="el-icon-user"></i>个人中心</el-menu-item>
  <el-menu-item index="/backend"><i class="el-icon-s-platform"></i>后台管理</el-menu-item>
  <el-menu-item index="/login" style="margin-left: 30px"><i class="el-icon-switch-button"></i>{{this.$store.state.loginOrLogout}}</el-menu-item>
  <el-menu-item index="/register"><i class="el-icon-position"></i>注册</el-menu-item>
</el-menu>
</div>
</div>
</template>

<script>
import { RouterLink } from 'vue-router';

 export default{
    name: "PageHead",
    data() {
        return {
            activeIndex: "1",
            activeIndex2: "1",
        };
    },
    methods: {
        handleSelect(key, keyPath) {
          if(key == '/login'){
            if(this.$store.state.loginOrLogout == "注销"){
              this.logout();
              return;
            }
          }
          this.$router.push(key);
        },
        logout(){
            this.$axios.get("/user/logout").then((response)=>{
                this.res = response.data;
                sessionStorage.removeItem('userId');
                if(this.res.code == '200'){
                    this.$message.success("注销成功");
                    this.$store.commit('changeLoginOrLogout',"登录")
                    this.$router.push('/');
                }else{
                    this.$message.error("注销失败");
                }
            }).catch((response)=>{
                console.log(response);
            })
        }
    },
    components: { RouterLink }
}
</script>

<style scoped>

</style>
